export default {
    name: 'zsPicker',
	model:{
		prop: "value", // 绑定的属性
		event: "change" // 触发事件
	},
    props: {
        placeholder: {
            type: String,
            default: '请选择...'
        },
        // 列表 {value:'' , label:''}
        options: {
            type: Array,
            default: null
        },
        value: {
            type: Number | String,
            default: ''
        },
        // 自定义节点 label、value的字段， {label: 'text', value: 'id'}
        fieldNames: {
            type: Object,
            default: () => { return {label: 'label', value: 'value'}  },
			
        },
        // 显示文本最大长度
        maxTextLength: {
            type: Number,
            default: 100
        },
		rightIcon: {
			type: String,
			default: 'icon-xialasanjiao'
		},
		disabled:{
			type: Boolean,
			default: false
		}
    },
    data() {
        return {
            index: -1,
        }
    },
    watch:{
        value: function (newVal, oldVal) {
            this.index = -1;
            for (var i = 0; i < this.options.length; i++) {
                if (this.options[i][this.fieldNames.value] === newVal) {
                    this.index = i;
                }
            }
        },
    },
    mounted() {
        this.index = -1;
        for (var i = 0; i < this.options.length; i++) {
            if (this.options[i][this.fieldNames.value] === this.value) {
                this.index = i;
            }
        }
    },
    methods: {
        onChange(e) {
            this.index = e.detail.value;
            // const obj = {
            //     [this.fieldNames.value]: this.options[this.index][this.fieldNames.value],
            //     [this.fieldNames.label]: this.options[this.index][this.fieldNames.label]
            // };
            this.$emit('change', this.options[this.index][this.fieldNames.value]);
        },

    }
}